html {
	margin:0; padding:0; height:100%;
}

body {
	font:sans-serif; overflow:hidden;
}

img {
	border:none;
}

a {
	outline:0;
}

.gauge {
	margin:0.25em; height:1.25em;
	background:#333; border:thin solid black;
	font-size:smaller; line-height:1.25em; color:white;
	padding:0 0.25em;
	position:relative;
}

.gauge > div {
	position:absolute; left:0; top:0; height:100%;
	background:#ccc;
	opacity:0.5;
}

#header {
	position:fixed; left:0; right:0; top:0; height:3em; margin:0; padding:0;
	overflow:hidden;
}

#info {
	position:fixed; left:0; right:0; top:3em; height:1.5em; margin:0; padding:0;
	overflow:hidden;
}

#actorlist {
	position:fixed; left:0; top:4.5em; bottom:3em; width:50%; margin:0; padding:0;
	overflow-x:hidden; overflow-y:auto;
}

#map {
	position:fixed; right:0; top:4.5em; bottom:3em; width:50%; margin:0; padding:0;
	overflow:hidden;
}

#footer {
	position:fixed; left:0; right:0; bottom:0; height:3em; margin:0; padding:0;
	overflow:hidden;
}

#header > * {
	float:left; margin:0 0.5em; height:3em; line-height:3em;
}

#info > .split {
	float:left; margin:0; padding:0; width:20%;
}

#map > #map-image {
	width:400px; height:400px; position:relative;
}

#map > #map-image > img {
	position:absolute; left:0; bottom:0;
}

#map > #map-image > #map-char {
	position:absolute;
	width:0.5em; height:0.5em; margin:0 0 -0.25em -0.25em;
	background:white; border:thin solid black;
	-moz-border-radius:0.25em;
}

#footer > * {
	float:left; margin:0 0.5em; height:3em; line-height:3em;
}
